﻿<!DOCTYPE html>
<html ng-app="hrApp">
<head>
    <title>HR App</title>
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" />
    <script src="scripts/angular.min.js"></script>
    <script>
        var employees = [
            { id: 10001, name: "Jerry", gender: 1, email: "jerry@etc.com", birthday: "1979-01-01" },
            { id: 10002, name: "Jam", gender: 0, email: "jam@etc.com", birthday: "1980-01-01" },
            { id: 10003, name: "David", gender: 1, email: "david@etc.com", birthday: "1981-01-01" },
            { id: 10004, name: "Mike", gender: 1, email: "mike@etc.com", birthday: "1982-01-01" }
        ];

        var hrApp = angular.module('hrApp', [])
            .controller("EmployeeCtrl", function ($scope) {
                $scope.employees = employees;
        });
    </script>
</head>
<body ng-controller="EmployeeCtrl">
    <div class="container">
        <div class="page-header">
            <h1>
                员工信息列表
            </h1>
        </div>
        <table class="table table-striped">
            <thead>
                <tr>
                    <th>员工编号</th>
                    <th>姓名</th>
                    <th>性别</th>
                    <th>电子邮件</th>
                    <th>出生日期</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="employee in employees">
                    <td>{{employee.id}}</td>
                    <td>{{employee.name}}</td>
                    <td>{{employee.gender == 1 ? "男" : "女"}}</td>
                    <td><a ng-href="mailto:{{employee.email}}">{{employee.email}}</a></td>
                    <td>{{employee.birthday | date:"yyyy-MM-dd"}}</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>
